<template>
  <!--员工绩效列表-->
  <section class="yl-clearfix">
    <div class="searchgrid">

      <div class="yl-float-right">
        <input v-model="filters.fromDate" type="date" placeholder="请输入开始日期">
        <input v-model="filters.toDate" type="date" placeholder="请输入结束日期">
        <input class="yl-input-text" v-model="filters.employe_id" type="text" placeholder="代理商编号">
        <input class="yl-input-text" v-model="filters.cellphone" type="text" placeholder="客户手机号">
        <input value=" 查询 " class="yl-input-button" type="button" @click="fetchEmployeeTotalReportList">
        <input value=" 导出xls " class="yl-input-button" type="button" @click="">

      </div>
    </div>
    <el-table :data="pagination.data"
              highlight-current-row
              v-loading="listLoading"
              :summary-method="getSummaries"
              show-summary
              style="width: 100%;">
      <el-table-column label="编号" prop="employee.name"></el-table-column>
      <el-table-column label="手机号" prop="employee.phone"></el-table-column>
      <el-table-column label="姓名" prop="employee.employee_name"></el-table-column>
      <el-table-column label="注册时间" prop="employee.created_time"></el-table-column>
      <el-table-column prop="cust_day_capital_amount" label="可用余额"></el-table-column>
      <el-table-column prop="cust_day_stock_finance" label="新增配资"></el-table-column>
      <el-table-column label="累计配资金额" prop="full.cust_total_stock_finance"></el-table-column>
      <el-table-column label="交易金额" prop="cust_day_makedeal"></el-table-column>
      <el-table-column label="递延费" prop="total_interests_percentage"></el-table-column>
      <el-table-column prop="total_commision_percentage" label="服务费"></el-table-column>


    </el-table>


    <div class="yl-pagination">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="pageIndexChange"
        :current-page="pagination.current_page"
        :page-sizes="[15, 30, 45, 60]"
        layout="total, sizes, prev, pager, next, jumper"
        :page-size="parseInt(pagination.per_page)"
        :total="pagination.total"
        style="float:right;">
      </el-pagination>
    </div>

  </section>

</template>

<script>
  import {getEmployeeTotalReports} from '../../api/report';


  Date.prototype.format = function (fmt) {
    var o = {
      "M+": this.getMonth() + 1,                 //月份
      "d+": this.getDate(),                    //日
      "h+": this.getHours(),                   //小时
      "m+": this.getMinutes(),                 //分
      "s+": this.getSeconds(),                 //秒
      "q+": Math.floor((this.getMonth() + 3) / 3), //季度
      "S": this.getMilliseconds()             //毫秒
    };
    if (/(y+)/.test(fmt)) {
      fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
    }
    for (var k in o) {
      if (new RegExp("(" + k + ")").test(fmt)) {
        fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
      }
    }
    return fmt;
  }

  export default {
    data() {
      let date = new Date();
      let monthFirstDay = new Date(date.getFullYear(), date.getMonth(), 1);
      var monthLastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0);
      let fDay = monthFirstDay.format("yyyy-MM-dd");
      let tDay = monthLastDay.format("yyyy-MM-dd");

      return {
        filters: {
          fromDate: fDay,
          toDate: tDay,
          cellphone: null,
          page: 1,
          size: 15,
          employe_id: null,
        },
        pagination: {},
        listLoading: false,
      }
    },
    methods: {
      getSummaries(param) {
        const sums = [
          '合计',
          '',
          '',
          '',
        ];
        return sums.concat(this.pagination.sum);
      },
      pageIndexChange(clickPageIndex) {
        //分页页面发生改变
        this.filters.page = clickPageIndex;
        this.fetchEmployeeTotalReportList();
      },
      //获取用户列表
      fetchEmployeeTotalReportList() {
        let params = this.filters;
        this.listLoading = true;
        getEmployeeTotalReports({params}).then((res) => {
          this.pagination = res.data;
          this.listLoading = false;
        }).catch(error => this.ezNotifyAxiosCatch(error));
      },
      handleSizeChange(size) {
        this.filters.size = size;
        this.filters.page = 1;
        this.fetchEmployeeTotalReportList();
      }
    },
    mounted() {
      this.fetchEmployeeTotalReportList();
    }
  }
</script>

